<template>
	<view class="orderAll">
		<!-- <view class="toper flex-row">
			<image src="../../static/icon/timer.png"></image>
			<view>
				<text>23</text>
				小时
				<text>26</text>
				分
				<text>12</text>
				秒后将自动关闭
			</view>
		</view> -->
		<view class="content">
			<view class="listBox"  v-if="List.length" v-for="(item,index) in List" :key='index'>
				<view class="list" @click="goDetail(item.orderId)">
					<view class="title">{{item.patentName}}</view>
					<view class="tagList flex-row">
						<view v-for="(i,index) in getlaber(item.keywords) " :key="index+5">{{i}}</view>
						
					</view>
					<!-- <view class="classList">
						<view>申请成果评价</view>
						<view>申请风险投资是大幅度</view>
						<view>专撒旦</view>
						<view>专利产品化合作</view>
					</view> -->
					<view class="desc text-ellipsis3">
						{{item.introduction}}
					</view>
				</view>
				<view class="priceBox flex-row flex-between">
					<view></view>
					<view class="flex-row">
						<view class="style">合作方式:买断</view>
						<view class="price">
							成交价格:
							<text >￥{{item.money}}</text>
						</view>
					</view>
				</view>
				<view class="statusBox flex-row flex-between">
					<!-- {{item.status==1?'待签约':item.status==2?'待支付':item.status==3?'卖家确认':item.status==4?'待过户':item.status==5?'买家待确认':item.status==6?'已完成':item.status==7?'已退款':item.status==8?'已取消'}} -->
					<!-- status订单状态 1=已下单待签约，2=已签约待支付，3=已支付待确认 卖家确认，4=已确认待过户，
					5=买家待确认，6=已完成 客户确认完成之后无法退款，7=已退款，8=已取消 , -->
					<view v-if="item.status==1" class="statusbox" >
						<view class="status"> 待签约</view>
						<view class="flex-row btnGroup">
							<view @click="cancelOrder(item.orderId)">取消订单</view>
							<view class="op" @click="createFlowOneStep(item.orderId)">立即签约</view>
						</view>
					</view>
					<view v-if="item.status==2" class="statusbox">
						<view class="status"> 待支付</view>
						<view class="flex-row btnGroup">
							<view @click="cancelOrder(item.orderId)">取消订单</view>
							<view class="op" @click="gopay(item.orderId,item.money)">去支付</view>
						</view>
					</view>
					<view v-if="item.status==3" class="statusbox">
						<view class="status"> 卖家确认</view>
						<view class="flex-row btnGroup">
							<view class="op" v-if='type==1'>等待卖家确认</view>
							<view class="op" v-if='type==2' @click="sellConfirm(item.orderId)">卖家确认</view>
						</view>
					</view>
					<view v-if="item.status==4" class="statusbox">
						<view class="status"> 待过户</view>
						<view class="flex-row btnGroup">
							<view class="op" >确认交易</view>
						</view>
					</view>
					<view v-if="item.status==5" class="statusbox" >
						<view class="status"> 待确认</view>
						<view class="flex-row btnGroup">
							<view class="op"  @click="buyConfirm(item.orderId)">买家确认</view>
						</view>
					</view>
					<view v-if="item.status==6" class="statusbox">
						<view class="status">已完成</view>
						<view class="flex-row btnGroup">
							<view class="op">去评价</view>
						</view>
					</view>
				</view>
			</view>
			
			<view class="textCenter paddingtb20 font30" v-if="List.length==''">暂无数据</view>
			<uni-popup ref="uniPop" type="share">
				<uni-popup-payfor :type="msgType" @payTypes='payTypes' :title="title" :money="money":before-close="true" @confirm="dialogConfirm" @close="dialogClose"></uni-popup-payfor>
			</uni-popup>
			<passkeyborad :show="show" :money='money' @close='close' @password='password'></passkeyborad>
			
		</view>
	</view>
</template>

<script>
	import md5 from '../../api/md5.js'
	import passkeyborad from '@/components/yzc-paykeyboard/yzc-paykeyboard.vue'
	export default{
		components: {
		      passkeyborad
		    },
		data(){
			return{
				currentPage: 1,
				size: 10,
				type:'',
				status:'',
				List:[],
				title: "请选择支付方式",
				packageList: [],
				msgType:'',
				orderId:'',
				show:false,
				money:'',
				passwords:'',
				payType:''
				
			}
		},
		onLoad(option) {
			if(option.type){
				this.type =option.type
				this.status =option.status
				uni.setNavigationBarTitle({
				   title:option.name
				})
			}
		},
		onShow() {
			if(this.type==1 || this.type==2){
				this.getOrderList()
			}else if(this.type==3){
				this.getTransfeOrderList()
			}
		},
		methods:{
			//获取买订单列表 type==1  获取卖订单列表type==2
			getOrderList() {
				this.$http.get('/orderPatent/getOrderList', {
					status: this.status,
					size: this.size,
					current: this.currentPage,
					type:this.type
				}).then(res => {
					if (res.code == '0') {
						this.List = res.data.records;
					}
				})
			},
			//获取卖订单列表
			
			//获取机构订单列表
			getTransfeOrderList() {
				this.$http.get('/orderPatent/getOrderTransferList', {
					status: 0,
					size: this.size,
					current: this.currentPage,
					type:this.type
				}).then(res => {
					if (res.code == '0') {
						this.List = res.data.records;
					}
				})
			},
			goDetail(id){
				uni.navigateTo({
					url:'/pages/order/detail?id='+id+'&type='+this.type
				})
			},
			getlaber(item) {
				return item.split(',')
			},
			payTypes(id){
				console.log(id)
				this.payType = id
				if(id ==1 || id ==2){
					this.getPayType()
				}
				
			},
			//h获取密码
			password(name){
				console.log(name)
				this.passwords = md5(name)
				console.log(this.passwords)
				this.show =false
				
				this.balancePayOrder()
				
			},
			
			//取消订单	
			cancelOrder(id){
				let that = this
				uni.showModal({
				    title: '提示',
				    content: '确认取消订单',
				    success: function (res) {
				        if (res.confirm) {
							that.$http.get('/orderPatent/cancelOrder', {
								orderId: id}).then(res => {
								if (res.code == '0') {
									uni.showToast({
										title:'取消成功',
										icon:'success',
									})
									setTimeout(function(){
										that.getOrderList()
									},1500)
								}
							})
				            
				        } else if (res.cancel) {
				            console.log('用户点击取消');
				        }
				    }
				});
				
				
			},
			gopay(id,money){
				this.$refs.uniPop.open()
				this.orderId = id
				this.money = money
			},
			dialogClose(done) {
				
				done()
			},
			close(flag){
				console.log(flag)
				this.show = flag
			},
			//余额支付
			balancePayOrder(){
				let that = this
				this.$http.get('/orderPatent/balancePayOrder', {orderId:this.orderId,password:this.passwords}).then(res => {
					if (res.code == '0') {
						uni.showToast({
							title: res.msg,
							icon:'success',
							icon: 'none'
						});
						setTimeout(function(){
							that.getOrderList()
						},1500)
					}else if(res.code==2){
						uni.showModal({
							title: '提示',
							content: res.msg,
							success: function (res) {
								if (res.confirm) {
									uni.navigateTo({
										url:'../person/setPayPwd'
									})
								} else if (res.cancel) {
									console.log('用户点击取消');
								}
							}
						});
						
					}else {
						console.log(res.data)
						uni.showToast({
							title: res.msg,
							icon: 'none'
						});
					}
				});
			},
			// 微信 支付宝支付
			getPayType(){
				console.log(this.payType)
				this.$http.get('/orderPatent/payOrderInfo', {payType:this.payType,orderId:this.orderId}).then(res => {
					console.log(res.data)
					if (res.code == '0') {
						
						if(this.payType==1){
							uni.requestPayment({
							       provider: 'wxpay',
							       orderInfo: JSON.stringify(res.data.orderInfo),
							       success: function(res) {
							           console.log('success:' + JSON.stringify(res));
							       },
							       fail: function(err) {
									   
							       }
							   });
						}else if(this.payType == 2){
							uni.requestPayment({
							       provider: 'alipay',
							       orderInfo:res.data.orderInfo,
							       success: function(res) {
							           console.log('success:' + JSON.stringify(res));
									   this.getOrderList()
							       },
							       fail: function(err) {
							           console.log('fail:' + JSON.stringify(err));
																			
							       }
							   });
						}
					} else {
						uni.showToast({
							title: res.msg,
							icon: 'none'
						});
					}
				});
			},
			
			dialogConfirm(done) {
				done()
				this.show = true
			},
			//获取支付方式
			getOrderPayInfo() {
				this.$http.get('/orderPackage/getOrderPayInfo', {payType:this.payType,vipPackageId:this.vipPackageId}).then(res => {
					if (res.code == '0') {
						console.log(res.data)
						if (res.data != '') {
							uni.showToast({
								title: res.msg,
								icon: 'none'
							});
							
						}
					} else {
						uni.showToast({
							title: res.msg,
							icon: 'none'
						});
					}
				});
			},
			
			buyNow() {
				
			},
			//买家确认订单
			buyConfirm(id){
				let that = this
				this.$http.get('/orderPatent/buyConfirmOrder', {orderId:id}).then(res => {
					if (res.code == '0') {
						uni.showToast({
							title: res.msg,
							icon: 'success'
						});
						setTimeout(function(){
							that.getOrderList()
						},1500)
					}else{
						uni.showToast({
							title: res.msg,
							icon: 'none'
						})
					}
				});
			},
			// 卖家确认订单
			sellConfirm(id){
				let that = this
				this.$http.get('/orderPatent/sellConfirmOrder', {orderId:id}).then(res => {
					if (res.code == '0') {
						uni.showToast({
							title: res.msg,
							icon: 'success'
						});
						setTimeout(function(){
							that.getOrderList()
						},1500)
						
					}else{
						uni.showToast({
							title: res.msg,
							icon: 'none'
						})
					}
					
				})
			},
			//立即签约
			createFlowOneStep(id){
				let that = this
				this.$http.get('/contract/createFlowOneStep', {orderId:id}).then(res => {
					if (res.code == '0') {
						uni.showToast({
							title: res.msg,
							icon: 'success'
						});
						setTimeout(function(){
							that.getOrderList()
						},1500)
						
					}else{
						uni.showToast({
							title: res.msg,
							icon: 'none'
						})
					}
					
				})
			},
			
		},
		
		
	}
</script>

<style scoped lang="scss">
	page{
		background: #fefefe;
	}
.orderAll {
	.toper {
		padding: 25upx 20upx;
		font-size: 26upx;
		color: #22222a;
		background: rgba(253, 88, 10, 0.1);
		// justify-content: space-between;
		align-items: center;
		margin-bottom: 20upx;
		text {
			color: #39d214;
		}
		> image {
			width: 26upx;
			height: 26upx;
			margin-right: 12upx;
		}
	}
	.content {
		.listBox {
			background: #fff;
			padding: 0 30upx 20upx;
			border-bottom: 1px solid #efefef;
			.priceBox{
				align-items: center;
				padding: 10upx 0 20upx;
				.style{
					font-size: 30upx;
					color: #66666A;
					margin-top: 10upx;
				}
				.price{
					font-size: 30upx;
					color: #22222A;
					padding-left: 60upx;
					text{
						font-size:36upx;
						color: #FE590B;
					}
					
				}
			}
			.statusBox{
				.statusbox{
					width: 100%;
					display: flex;
					justify-content: space-between;
				}
				.status{
					font-size: 32upx;
					color: #FE590B;
				}
				.btnGroup{
					>view{
						// width:200upx;
						padding: 0 20upx;
						height:55upx;
						border:1px solid rgba(154,154,154,1);
						border-radius:8upx;
						color: #9A9A9A;
						font-size: 29upx;
						text-align: center;
						line-height: 55upx;
						font-size: 28upx;
						&.op{
							color: #FE590B;
							border:1px solid rgba(253,88,10,1);
							margin-left: 20upx;
						}
					}
				}
			}
			.list {
				padding: 30upx 0;
				border-bottom: 1upx solid rgba(238, 238, 238, 1);
				// &:last-child {
				// 	border-bottom: none;
				// }
				.title {
					font-size: 32upx;
					color: #22222a;
					font-weight: bold;
				}
				.tagList {
					padding-top: 23upx;
					padding-bottom: 23upx;
					> view {
						font-size: 22upx;
						color: #fd580a;
						border: 1upx solid #fd580a;
						padding: 5upx 10upx;
						margin-right: 16upx;
						border-radius: 8upx;
					}
				}
				.classList {
					color: #38d214;
					font-size: 26upx;
					// flex-wrap: wrap;
					> view {
						display: inline-flex;
						background: url(../../static/icon/green.png) no-repeat left 13upx;
						background-size: 8upx 8upx;
						padding-left: 20upx;
						margin-right: 37upx;
						padding-bottom: 20upx;
						&:first-child {
							margin-left: 0;
						}
					}
				}
				.desc {
					color: #666666;
					font-size: 28upx;
				}
			}
		}
	}
}
</style>
